<template>
	<!-- 修改员工信息 -->
	<view class="" v-show="show">
		<view class="toptext">
			<text class="text">{{title}}</text>
		</view>
		<view class="boximg">
			<text class="text">头像</text>
			<button class="btn" @click="btnimg"></button>
			<image :src="list.headimg"></image>
		</view>
		<view class="boxtext">
			<text class="text">账号</text>
			<input class="input" disabled="false" type="text" v-model="list.account">
		</view>
		<view class="boxtext">
			<text class="text">员工名称</text>
			<input class="input"  style="color: black;" type="text" v-model="list.empname">
		</view>
		<view class="boxtext">
			<text class="text">员工编号</text>
			<input class="input" disabled="false" type="text" v-model="list.empid">
		</view>
		<view class="boxtext">
			<text class="text">所属部门</text>
			<input class="input" disabled="false" type="text" v-model="dptname">
		</view>
		<view class="boxtext">
			<text class="text">性别</text>
			<input class="input" style="color: black;" type="text" v-model="list.sex">
		</view>
		<view class="boxtext">
			<text class="text">年龄</text>
			<input class="input" style="color: black;" type="number" v-model="list.age">
		</view>
		<view class="boxtext">
			<text class="text">绑定手机</text>
			<input class="input" style="color: black;" type="text" v-model="list.tel">
		</view>
		<view class="boxtext">
			<text class="text">联系地址</text>
			<input class="input" style="color: black;" type="text" v-model="list.address">
		</view>
		<view class="btnbox">
			<button @click="updata">保存</button>
		</view>
	</view>	
</template>

<script>
	export default {
		data() {
			return {
				title:'修改员工信息',dptname:'',show:false,list:{}
			}
		},
		onLoad(option) {
			var opt = JSON.parse(option.item)
			this.list = opt;
			this.getdata();
		},
		methods: {
			async btnimg(){
				const res = await this.Upload({
					url:'api/upload/postimage'
				});
				this.url=  res.data.slice(8,80)
			},
			async getdata(){
				const dptname =await this.Request({
					url:'api/department/getdpt',
					method:'POST',
					data:{dptid:this.list.departmentid}
				})
				this.dptname = dptname.data[0].dptname
				uni.showToast({
					title:'正在加载',
					icon:"loading",
					duration:500
				})
				setTimeout(() => {
					this.show = true
				},500)
			},
			async updata(){
				const res = await this.Request({
					url:'api/employee/updepdata',
					method:'PUT',
					data:{headimg:this.list.headimg,empname:this.list.empname,sex:this.list.sex,
						  age:this.list.age,tel:this.list.tel,address:this.list.address,empid:this.list.empid}
				})
				if(res.data.affectedRows=1){
					uni.showToast({
						title: '保存成功',
						duration:450
					})
					setTimeout(() => {
						uni.reLaunch({
							url:'/pages/buyer/buy-hompage/buy-hompage'
						})
					},500)
				}
			}
		}
	}
</script>

<style lang="scss">
	.toptext{
		width: 100%;
		background-color: #efefef;
		display: flex;
		border-bottom: 1px solid #ccc;
		.text{
			margin: 5px 0 5px 5px;
			font-size: 110%;
			font-weight: 700;
			color: #d3d3d3;
		}
		.img1{
			margin: auto 0;
			height: 20px;
			width: 20px;
			margin-left: 260px;
		}
	}
	.boximg{
		height: 80px;
		width: 80px;
		display: flex;
		position: relative;
		.text{
			// margin-top: 30px;
			margin: auto 0;
			margin-left: 10px;
			font-size: 100%;
			font-weight: 600;
		}
		.btn{
			height: 70px;
			width: 70px;
			position: absolute;
			margin-top: 5px;
			margin-left: 135px;
			z-index: 5;
			opacity: 0;
		}
		image{
			position: absolute;
			margin: 5px 0 5px 135px;
			height: 70px;
			width: 70px;
			/* 背景图片置于最低层 */
			z-index: 3;
		}
	}
	.boxtext{
		height: 50px;
		display: flex;
		// position: relative;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
		.text{
			margin: auto 0;
			margin-left: 10px;
			font-size: 100%;
			font-weight: 600;
		}
		.input{
			position: absolute;
			margin-top: 10px;
			margin-left: 135px;
			color: #eadbad;
		}
	}
	.btnbox{
		button{
			margin-top: 20px;
			width: 60%;
			background-color: #b7e481;
		}
	}
</style>
